<%@ page import="com.example.domain.Post" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <title>校园论坛系统-帖子详情页</title>
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <link href="css/user.css" rel="stylesheet"> <!-- 自定义样式 -->
  <link href="css/postInfo.css" rel="stylesheet">
  <script src="js/jquery-3.5.1/jquery-3.5.1.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script src="js/postInfo.js"></script>
  <style>
    img {
      vertical-align: middle;
      margin-left: -15px;
    }
  </style>
</head>
<body>
<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="/userIndex.jsp">校园论坛系统</a>
    </div>
    <ul class="nav navbar-nav">
      <li><a href="#" id="forumIndex">帖子详情页</a></li>
    </ul>
  </div>
</nav>
<div id="container" class="container mt-4">
  <div class="card">
    <div class="row g-0">
      <div class="col-md-3">
        <img src="/img/R.png" class="img-fluid" alt="Card side image">
      </div>
      <div class="col-md-9">
        <div class="card-body d-flex flex-column justify-content-between">
          <div>
            <h3 class="card-title text-primary" style="font-weight: bold;"><%= ((Post)request.getAttribute("post")).getTitle() %></h3>
            <p class="content-size"><%= ((Post)request.getAttribute("post")).getContent() %></p>
          </div>
          <div class="publish-info mt-3">
            <p class="mb-0">发布者: <span id="publisher"><%= ((Post)request.getAttribute("post")).getUser().getUsername() %></span></p>
            <p class="mb-0">发布时间: <span id="publishTime"><%= ((Post)request.getAttribute("post")).getCreateTime() %></span></p>
          </div>
          <!-- 评论区域开始 -->
          <div class="panel panel-default" style="margin-top: 50px">
            <div class="panel-heading">
              <h3 class="panel-title">回贴</h3>
            </div>
            <div id="reply_body" class="panel-body">
              <!-- 评论列表 -->
              <div class="comment-list">
                <ul class="media-list">
                  <c:forEach items="${commentList}" var="Comment">
                    <li class="media">
                      <div class="media-body">
                        <p class="reply-content">${Comment.getContent()}</p>
                        <div class="publish-info mt-3">
                          <span class="media-heading mb-0">${Comment.getUser().getUsername()}</span>
                          <span class="reply-time mb-0">${Comment.getCreateTime()}</span>
                        </div>
                      </div>
                    </li>
                    <hr>
                  </c:forEach>
                </ul>
              </div>
              <!-- 发表回复的表单 -->
              <div class="form-group reply_input">
                <form id="main_reply" class="main_reply" action="/commentServlet" method="post" onsubmit="return check();">
                  <input type="hidden" name="reid" value="<%= ((Post)request.getAttribute("post")).getId() %>">
                  <div class="form-group">
                    <textarea id="main_reply_content" placeholder="请填写内容" name="content" class="form-control" row="1" required=""></textarea>
                  </div>
                  <div class=" reply_in">
                    <div class="emoji_right content btn_group btn-group-xs">
                      <button id="submitComment" class="btn btn-info " type="submit">确定</button>
                    </div>
                  </div>
                </form>
              </div>
            </div>
          </div>
          <!-- 评论区域结束 -->
        </div>
      </div>
    </div>
  </div>
</div>
</body>
</html>
